<template>
  <div class="index">
    <el-row type="flex" class="row-bg" justify="space-between">
      <el-col :span="10">快捷功能</el-col>
      <el-col :span="10"
        ><span v-if="false"><i class="el-icon-setting"></i> 管理</span></el-col
      >
    </el-row>
    <el-row class="rowMenu">
      <el-col
        :span="8"
        @click.native="
          skipToNext({
            title: '建档项目',
            newPath: '/home/monitorProjectManagement/projectDocumentation',
          })
        "
        v-if="userType == 'DIRECTOR' || (userType == 'MONITOR' && !isYS())"
      >
        <img :src="require('@/assets/newHome/short1.png')" alt="" />
        <p>建档项目</p>
      </el-col>
      <el-col
        :span="8"
        @click.native="
          skipToNext({
            title: '项目评级',
            newPath: '/home/enterpriseScore/projectScoreList',
          })
        "
        v-if="userType == 'DIRECTOR' || userType == 'MONITOR'"
      >
        <img :src="require('@/assets/newHome/short2.png')" alt="" />
        <p>项目评级</p>
      </el-col>
      <el-col
        :span="8"
        v-if="!isCzUser()"
        @click.native="
          skipToNext({ title: '数据大屏', newPath: '/home/chart/index' })
        "
      >
        <img :src="require('@/assets/newHome/short3.png')" alt="" />
        <p>数据大屏</p>
      </el-col>
      <el-col
        :span="8"
        @click.native="
          skipToNext({
            title: '数据平台',
            newPath: '/home/dynamicService/tobePerfect',
          })
        "
        v-if="
          userType == 'DIRECTOR' ||
          userType == 'MONITOR' ||
          userType == 'AREAMANAGE'
        "
      >
        <img :src="require('@/assets/newHome/short4.png')" alt="" />
        <p>数据平台</p>
      </el-col>
      <el-col
        :span="8"
        v-if="!isCzUser()"
        @click.native="
          skipToNext({
            title: '预警中心',
            newPath: '/home/project/constructAlertList',
          })
        "
      >
        <img :src="require('@/assets/newHome/short5.png')" alt="" />
        <p>预警中心</p>
      </el-col>
      <el-col
        v-if="isHave"
        :span="8"
        @click.native="
          skipToNext({
            title: '政务助手',
            newPath: 'home/checkAffairs/checkAffairsList',
          })
        "
      >
        <img :src="require('@/assets/newHome/short6.png')" alt="" />
        <p>政务助手</p>
      </el-col>
    </el-row>
  </div>
</template>
<script>
export default {
  name: 'ShortCuts',
  data() {
    return {
      isHave: false,
    }
  },
  props: ['userType'],
  mounted() {
    this.getRights()
  },
  watch: {
    userType: {
      handler(newval, oldval) {
        console.log(newval)
        this.userType = newval
        return newval
      },
      deep: true,
    },
  },
  methods: {
    getRights() {
      this.axios({
        method: 'post',
        url: 'api-m/menus/findmenubyname',
        data: {
          name: '政务助手',
        },
      })
        .then((res) => {
          this.isHave = res.data.result
        })
        .catch((resp) => {})
    },
    skipToNext(item) {
      if (item.title == '政务助手') {
        var appList = this.$store.state.appList
        for (var i = 0; i < appList.length; i++) {
          if (appList[i].name == '政务助手') {
            this.changeMenu(appList[i], i)
          }
        }
      } else if (item.title == '数据大屏') {
        this.$router.push({
          path: item.newPath,
        })
        this.addTab('数据大屏', item.newPath)
      } else {
        if (this.accessControl(item.newPath) == -1) {
          this.goNoAccessPage()
        } else {
          this.$router.push({
            path: item.newPath,
          })
          this.$store.commit('CHANGE_SLIDER_NAME', {
            oldUrl: item.newPath,
            newUrl: this.$router.currentRoute.fullPath,
          })
        }
      }
    },
    changeMenu(item, index) {
      if (item.appName === '政务助手') {
        this.getNum()
      }
      //点击菜单修改父组件的值
      this.$emit('updateCollapse', false)
      this.current = -1
      this.currentItem = index

      this.$store.state.currentItem = index
      this.$store.state.currentSelectItem = '-1'
      this.$store.state.menuList = []
      this.$store.state.menuList = item.menuList
      // this.$store.state.menuList = this.data;

      //清除tab栏数据
      this.$store.state.sliderBar = []
      // localStorage.removeItem("sliderBar");

      //默认选中
      if (item.menuList[0].child) {
        this.$router.push(item.menuList[0].child[0].url)
        this.$store.state.activeMenu = item.menuList[0].child[0].url
        //tab栏选中
        this.$store.state.sliderBar = [item.menuList[0].child[0]]
        this.$store.state.activeIndex = item.menuList[0].child[0].url
      } else {
        if (this.$store.state.userType === 'COMPANY') {
          if (item.code == 'company') {
            localStorage.setItem('urlName', 'companyHome')
          } else if (item.code == 'owner') {
            localStorage.setItem('urlName', 'constructCompanyHomeJS')
          } else if (item.code == 'project' || item.code == 'constructor') {
            localStorage.setItem('urlName', 'constructCompanyHome')
          }
        } else if (
          this.$store.state.userType == 'PROJECT_ADMINISTRATOR' ||
          this.$store.state.userType == 'LABOR_ADMINISTRATOR'
        ) {
          localStorage.setItem('urlName', 'projectHome')
        } else if (this.$store.state.userType == 'FENBAO_MANAGER') {
          localStorage.setItem('urlName', 'subcontractHome')
        } else {
          if (item.code == 'company') {
            // console.log("企业首页")
            localStorage.setItem('urlName', 'monitorHome')
          } else if (item.code == 'project') {
            localStorage.setItem('urlName', 'constructMonitorHome')
          }
        }
        this.$router.push(item.menuList[0].url)
        this.$store.state.activeMenu = item.menuList[0].url

        //tab栏选中
        localStorage.removeItem('sliderBar')
      }
    },
    addTab(name, url) {
      if (name) {
        this.$store.state.activeMenuName = name
        // delete menu.newName;
        this.$store.state.activeMenu = url
        this.$store.commit('ADD_SLIDER', { name: name, url: url })
      }
    },
  },
}
</script>
<style lang="less" scoped>
.row-bg {
  height: 40px;
  line-height: 40px;
  border-bottom: 1px solid #e3e7e9;
  padding: 0 16px;
  .el-col {
    &:first-child {
      font-size: 16px;
      color: #333333;
      font-weight: 700;
    }
    &:last-child {
      text-align: right;
      font-size: 14px;
      color: #48a6ff;
      font-weight: 400;
    }
  }
}
.rowMenu {
  padding: 24px 12px 15px;
  .el-col {
    cursor: pointer;
    text-align: center;
    padding-bottom: 20px;
    img {
      display: block;
      width: 56px;
      height: 56px;
      margin: 0 auto;
    }
    p {
      line-height: 24px;
      font-size: 12px;
      color: #333;
    }
  }
}
</style>
